<extend name="Public:index" />
<block name="mycss">
  <link href="__PUBLIC__/assets/plugins/dropify/css/dropify.min.css" rel="stylesheet">
  <link href="__PUBLIC__/assets/plugins/datatables/buttons.bootstrap4.min.css" rel="stylesheet" type="text/css" />
</block>
<block name="main-content">
  <div class="container-fluid">
  
    <
    <div class="row">
      <div class="col-12">
        <div class="card">
        
          <div class="card-body">

            <div class="">
              <form id='myform' action="{:U('Web/Profile/upload')}" method="post" enctype='multipart/form-data'>
                <div class="form-group row">
                 
                  <div class="col-md-3">
                    <input type="file" onchange="onUpload()"  name= "input-file" id="input-file" class="dropify" data-default-file="{$data.image_url}" />
                  </div>
                  <div class="col-md-8">
                    <div class="form-group row">
                      <label  class="col-sm-2 col-form-label text-right" for="username">用户名</label>
                      <div class="col-sm-10">
                        <label  class="col-sm-8 col-form-label text-left" for="username">{$data.username}</label>
                      </div>
                    </div>
                   <div class="form-group row">
                      <label  class="col-sm-2 col-form-label text-right" for="username">公司名</label>
                      <div class="col-sm-10">
                        <label  class="col-sm-8 col-form-label text-left" for="username">{$data.company}</label>
                      </div>
                    </div>
                  </div>
                </div>
              </form>
            </div>

          </div>
        </div>
      </div>
    </div>
    <div class="row">我的项目</div>
   
  </div>
</block>
<block name="myscript">
  <script src="__PUBLIC__/assets/plugins/dropify/js/dropify.min.js"></script>
  <script src="__PUBLIC__/assets/plugins/upload/ajaxfileupload.js"></script>
  <script>
    $('.dropify').dropify({
      messages: {
        'default': '点击或拖拽文件到这里',
        'replace': '点击或拖拽文件到这里来替换文件',
        'remove':  '移除文件',
        'error':   '对不起，你上传的文件太大了',
    } 
  
    });
  //  $('.dropify').on('change',function(e){
  //    console.log(e)
         //写一个上传按钮   是隐藏的 
         //有改动就显示  让他自己点击上传
         
  //  })
    function handleFiles(files){
      // files  信息
      //blob
      console.log(getObjectURL(files[0]))

      //ajax 上传也可以这样
       var file =$('.dropify').get(0).files.item(0);
      console.log(file)
    }
    function onUpload111(){
        // var formData = $('.dropify').get(0).files.item(0);  
        console.log($('.dropify').val())
        var img =$('.dropify').val();
        var formData=new FormData();
            formData.append("image",img);
        $.ajax({  
               url: "{:U('Web/Profile/upload')}" ,  
               type: 'POST',  
               data: formData,  
             
               async: false,  
               cache: false,  
               contentType: 'application/my-binary-type',
               processData: false,  
               success: function (response) {  
                 console.log(response)
                   if(response.status == 1){
                       //判断返回的status来确定文件是否上传成功，以及上传成功后要做的操作
                   }
                   alert(response.msg);  
               },  
        }); 
    }
    function onUpload(){
             var url = "{:U('Web/Profile/upload')}";
             $.ajaxFileUpload({
                url: url, 
                type: 'post',
                secureuri: false, //一般设置为false
                fileElementId: "input-file", // 上传文件的name属性名
                dataType: 'text', //返回值类型，一般设置为json
                success: function(data){
                   

                },
                error: function(data, status, e){ 
                    alert(e);
                    console.log(data);
                }
            });
    } 
    function getObjectURL(file) {
    var url = null ;
    if (window.createObjectURL!=undefined) { // basic
        url = window.createObjectURL(file) ;
    } else if (window.URL!=undefined) { // mozilla(firefox)
        url = window.URL.createObjectURL(file) ;
    } else if (window.webkitURL!=undefined) { // webkit or chrome
        url = window.webkitURL.createObjectURL(file) ;
    }
    return url ;
}
  </script>
</block>